{include file="public/header-static"/}
{include file="public/sidebar"/}
<div id="main">
    {include file="public/header"/}
    <main class="main-content">
        <div class="container">
            <div class="page-header">
                <nav aria-label="breadcrumb">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item">
                            <a href="#">首页</a>
                        </li>
                        <li class="breadcrumb-item active" aria-current="page">需求编辑</li>
                    </ol>
                </nav>
            </div>
            <div class="row">
                <div class="col-md-12">
                    <div class="card">
                        <div class="card-body">
                            <form action="{:url('/demand/demandEdit')}" method="post" target="iframe_form"
                                  enctype="multipart/form-data">

                                <div class="form-group row">
                                    <label for="" class="col-sm-1 col-form-label">用户ID</label>
                                    <div class="col-sm-8">
                                        <input type="text" name="uid" class="form-control" placeholder="用户ID"
                                               value="{$info.uid}" readonly>
                                    </div>
                                </div>

                                <div class="form-group row">
                                    <input type="hidden" name="id" value="{$info.id}">
                                    <input type="hidden" name="status" value="{$info.status}">
                                    <label for="" class="col-sm-1 col-form-label">社群名称</label>
                                    <div class="col-sm-8">
                                        <input type="text" name="name" class="form-control" placeholder="社群名称"
                                               value="{$info.name}">
                                    </div>
                                </div>

                                <div class="form-group row">
                                    <label class="col-sm-1 col-form-label">社群类型</label>
                                    <div class="input-group col-sm-8">

                                        <select name="tid" class="form-control">
                                            <option value="">请选择社群类型</option>
                                            <option value="1" {if $info.tid==
                                                    1}selected{/if}>企业社群</option>
                                            <option value="2" {if $info.tid==
                                                    2}selected{/if}>个人社群</option>
                                        </select>

                                    </div>
                                </div>

                                <div class="form-group row">
                                    <label for="" class="col-sm-1 col-form-label">社群标签</label>
                                    <div class="col-sm-8">
                                        <input type="text" name="label" class="form-control" placeholder="社群标签（例如母婴、饮品（2~5字以内））" value="{$info.label}">
                                    </div>
                                </div>

                                <div class="form-group row">
                                    <label class="col-sm-1 col-form-label">所在地区</label>
                                    <div class="input-group col-sm-8">

                                        <select name="province" id="province" class="form-control" style="width:33%;">
                                            <option value="">请选择省份</option>
                                            {volist name="province" id="vo"}
                                            <option value="{$vo.location_id}" {if $vo.location_id==
                                                    $info.province}selected{/if}>{$vo.name}</option>
                                            {/volist}
                                        </select>

                                        <select name="city" id="city" class="form-control" style="width:33%;">
                                            <option value="">请选择城市</option>
                                            {volist name="city" id="vo"}
                                            <option value="{$vo.location_id}" {if $vo.location_id== $info.city}selected{/if}>{$vo.name}</option>
                                            {/volist}
                                        </select>

                                        <select name="area" id="area" class="form-control" style="width:33%;">
                                            <option value="">请选择地区</option>
                                            {volist name="area" id="vo"}
                                            <option value="{$vo.location_id}" {if $vo.location_id== $info.area}selected{/if}>{$vo.name}</option>
                                            {/volist}
                                        </select>

                                    </div>
                                </div>

                                <div class="form-group row">
                                    <label class="col-sm-1 col-form-label">LOGO</label>
                                    <div class="col-sm-4">
                                        <input type="hidden" class="form-control logo1" name="logo" required=""
                                               aria-required="true" value="{$info.logo}">
                                        <button type="button" class="btn btn-secondary" id="logo1">上传LOGO</button>
                                        <span style="color: #6c757d">&nbsp;（ 尺寸建议：<span
                                                style="color: #13da13">50 * 50</span> ）</span>
                                        <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;">
                                            预览图：
                                            <div class="layui-upload-list uploader-list" style="overflow: auto;"
                                                 id="uploader-logo">

                                                {if $info.ylogo}
                                                <div class="file-iteme original">
                                                    <div class="handle" src="{$info.logo}">
                                                        <span class="fa fa-times"
                                                              style="border-radius: 0.375rem 0.375rem 0 0;"></span>
                                                    </div>
                                                    <img style="width: 5rem;height: 5rem;border-radius: 0.375rem;"
                                                         src="{$info.ylogo}">
                                                </div>
                                                {/if}


                                            </div>
                                        </blockquote>
                                    </div>
                                </div>

                                <div class="form-group row">
                                    <label for="" class="col-sm-1 col-form-label">社群人数</label>
                                    <div class="col-sm-8">
                                        <input type="text" name="group_number" class="form-control" placeholder="社群人数" value="{$info.group_number}">
                                    </div>
                                </div>

                                <div class="form-group row">
                                    <label for="" class="col-sm-1 col-form-label">社群价格</label>
                                    <div class="col-sm-8">
                                        <input type="text" name="price" class="form-control" placeholder="社群价格" value="{$info.price}">
                                    </div>
                                </div>

                                <div class="form-group row">
                                    <label class="col-sm-1 col-form-label">社群简介</label>
                                    <div class="col-sm-8">
                                        <textarea class="custom_text form-control" placeholder="社群简介" name="desc">{$info.desc}</textarea>
                                    </div>
                                </div>

                                <div class="form-group row">
                                    <label for="" class="col-sm-1 col-form-label">登记人ID</label>
                                    <div class="col-sm-8">
                                        <select name="enroll_id" id="enroll_id" class="form-control">
                                            <option value="">请选择登记人</option>
                                            {volist name="officialStaff" id="vo"}
                                            <option value="{$vo.id}" {if $vo.id == $info.enroll_id}selected{/if}>{$vo.name}</option>
                                            {/volist}
                                        </select>
                                    </div>
                                </div>

                                <button type="submit" class="btn btn-secondary">提交</button>
                            </form>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </main>

    {include file="public/footer"/}
    <script type="text/javascript">

        $(function () {
            // 城市
            $('#province').change(function () {
                var pid = $("#province option:selected").val();
                $.ajax({
                    type: "post",
                    url: '{:url("/location/getCity")}',
                    data: {'pid': pid},
                    success: function (res) {
                        console.log(res, res.code)
                        if (res.code == 1) {
                            result = res.data;
                            var strocity = '<option value="">请选择城市</option>';
                            for (var i = 0; i < result.length; i++) {
                                strocity += '<option value=' + result[i].location_id + '>';
                                strocity += result[i].name;
                                strocity += '</option>';
                            }
                            $("#city").text('');
                            $("#area").text('');
                            $("#area").append('<option value="">请选择地区</option>');
                            $("#city").append(strocity);
                        } else {
                            toastr.error(res.msg);
                        }
                    }
                })
            });

            // 地区
            $('#city').change(function () {
                var pid = $("#city option:selected").val();
                $.ajax({
                    type: "post",
                    url: '{:url("/location/getArea")}',
                    data: {'pid': pid},
                    success: function (res) {
                        if (res.code == 1) {
                            result = res.data;
                            var strocity = '<option value="">请选择地区</option>';
                            for (var i = 0; i < result.length; i++) {
                                strocity += '<option value=' + result[i].location_id + '>';
                                strocity += result[i].name;
                                strocity += '</option>';
                            }
                            $("#area").text('');
                            $("#area").append(strocity);
                        } else {
                            toastr.error(res.msg);
                        }
                    }
                })
            });
        });


        // 初始化封面图片路径
        var imagesArr = $('.images').val() ? $('.images').val().split(',') : [];
        // 各种上传
        layui.use('upload', function () {
            var $ = layui.jquery
                , upload = layui.upload;

            // LOGO上传
            upload.render({
                elem: '#logo1'
                , url: '{:url("/upload/uploadImages")}?path=demandLogo'
                , before: function (obj) {
                    layer.msg('logo上传中...', {
                        icon: 16,
                        shade: 0.05,
                        time: 0
                    });
                }
                , done: function (res) {
                    layer.close(layer.msg());//关闭上传提示窗口
                    // console.log(res)
                    //上传完毕
                    var logo = $('.logo1').val();
                    if (logo != '') {
                        // 删除旧图片
                        var element = $('#uploader-logo').children('.file-iteme');
                        if (!element.is('.original')) {
                            console.log('不是原LOGO数据，删除');
                            delImageOrVideo(logo);
                        }
                        element.remove();
                    }
                    $('.logo1').val(res.data.src);
                    $('#uploader-logo').append(
                        '<div id="" class="file-iteme">' +
                        '<div class="handle" src="' + res.data.src + '"><span class="fa fa-times" style="border-radius: 0.375rem 0.375rem 0 0;"></span></div>' +
                        '<img title=\'点我查看原图\' style="width: 5rem;height: 5rem;border-radius: 0.375rem;cursor: pointer" src=' + res.data.src + ' onclick="lookimg(this.src)">' +
                        // '<div class="info">' + res.data.name + '</div>' +
                        '</div>'
                    );
                }
            });

            // 二维码上传
            upload.render({
                elem: '#qrcode'
                , url: '{:url("/upload/uploadImages")}?path=demandQrCode'
                , before: function (obj) {
                    layer.msg('二维码上传中...', {
                        icon: 16,
                        shade: 0.05,
                        time: 0
                    });
                }
                , done: function (res) {
                    layer.close(layer.msg());//关闭上传提示窗口
                    // console.log(res)
                    //上传完毕
                    var qrcode = $('.qrcode').val();
                    if (qrcode != '') {
                        // 删除旧图片
                        var element = $('#uploader-qrcode').children('.file-iteme');
                        if (!element.is('.original')) {
                            console.log('不是原二维码数据，删除');
                            delImageOrVideo(qrcode);
                        }
                        element.remove();
                    }
                    $('.qrcode').val(res.data.src);
                    $('#uploader-qrcode').append(
                        '<div id="" class="file-iteme">' +
                        '<div class="handle" src="' + res.data.src + '"><span class="fa fa-times" style="border-radius: 0.375rem 0.375rem 0 0;"></span></div>' +
                        '<img title=\'点我查看原图\' style="width: 5rem;height: 5rem;border-radius: 0.375rem;cursor: pointer" src=' + res.data.src + ' onclick="lookimg(this.src)">' +
                        // '<div class="info">' + res.data.name + '</div>' +
                        '</div>'
                    );
                }
            });

        });

        // 删除图片
        $(document).on("click", ".file-iteme .handle", function (event) {
            console.log($(this).attr('src'))
            // 资源图删除
            if ($(this).is('.fm')) {
                var index1 = $.inArray($(this).attr('src'), imagesArr);
                console.log(index1);
                if (index1 > -1) {
                    imagesArr.splice(index1, 1);
                    $('.images').val(imagesArr);
                }
                // 群二维码
            } else {
                var parents = $(this).parents();
                var qrcode = parents.eq(3).children('.qrcode');
                console.log(qrcode)
                if (qrcode.val() != '') {
                    qrcode.val('');
                }
            }

            if (!$(this).parent().is('.original')) {
                console.log('不是原数据，删除');
                delImageOrVideo($(this).attr('src'));
            }

            $(this).parent().remove();
        });

    </script>


</div>